import Vue from 'vue'

// Vue.component('my-header',{
//   template:'<H1>this is my header</H1>'
// })

var MyheardChild = {
  template:'<p>this is my header child</p>'
}

var Myheard = {
  template:'<p><my-heard-child></my-heard-child> this is my header</p>',
  components: {
    'my-heard-child':MyheardChild
  }
}

new Vue({
  //挂在到index.html id=app的body元素上
  el: '#app',
  data: {
    message: 'hello',
    listItem :[
      'a','b','c'
    ]
  },
  components: {
    'my-header':Myheard
  },
  methods: {
    addItem (){
      console.log(this.listItem)
    }
  }

})

